<style lang="less">
  .loading-list {
    .el-icon-plus, .el-icon-minus {
      cursor: pointer;
    }
    .el-select {
      width: 100%;
    }
    .el-cascader {
      width: 100%;
    }
    .el-date-editor {
      width: 100%;
    }
  }

  .dialog-el-row {
    margin-bottom: 10px;
  }
</style>

<template>
  <div class="loading-list">
    <ue-search-bar ref="ueSearchBar" v-model="searchCondition" :data="querys" label-width="100px">
    </ue-search-bar>

    <!-- 操作 -->
    <el-col :span="24" style="margin-bottom: 10px">
      <el-col :span="12">
        <el-button type="primary" :disabled="loadingConfirmation || currentIsSpecialLineOrg  === false">装车确认
        </el-button>
        <el-button type="primary" :disabled="departureConfirmation || currentIsSpecialLineOrg  === false"
                   @click="getDepartById">发车
        </el-button>
        <el-button type="primary" :disabled="sels.length===0 || currentIsSpecialLineOrg === false" @click="remove">删除
        </el-button>
        <el-button type="primary" @click="adjust"
                   :disabled="selectedLoadingList===null || currentIsSpecialLineOrg  === false">调整装车单
        </el-button>
        <el-button @click="queryLoadingList">刷新</el-button>
      </el-col>
      <el-col :span="12" style="text-align: right">
        <el-button @click="LoadingLIstExpress">导出</el-button>
        <el-button :disabled="sels.length === 0" @click="printLoadList">发车单</el-button>
        <el-button :disabled="selectedLoadingList===null" @click="printLoadingList">打印装车单</el-button>
        <el-button type="primary" @click="queryLoadingList">查询</el-button>
        <el-button type="primary" @click="resetSearchCondition">重置</el-button>
      </el-col>
    </el-col>

    <!--列表-->
    <el-table highlight-current-row border
              :data="tableData"
              v-loading="listLoading"
              @current-change="handleCurrentChange"
              @selection-change="selsChange"
              style="width: 100%;">
      <el-table-column type="selection" width="55">
      </el-table-column>
      <el-table-column prop="createDate" label="创建日期" width="180">
      </el-table-column>
      <el-table-column prop="statusName" label="状态" width="100">
      </el-table-column>
      <el-table-column show-overflow-tooltip fit prop="number" label="装车单号">
        <template slot-scope="scope">
          <el-button type="text" @click="showLoadingList(scope.row)">{{ scope.row.number}}</el-button>
        </template>
      </el-table-column>
      <el-table-column show-overflow-tooltip prop="transportationName" label="运输路线" width="180">
      </el-table-column>
      <el-table-column prop="poll" label="票数" width="80">
      </el-table-column>
      <el-table-column prop="totalWeight" label="件重体" width="180" :formatter="formatterTrunkTasks">
      </el-table-column>
      <el-table-column fixed="right" show-overflow-tooltip prop="plateNumber" label="车牌号码" width="120">
      </el-table-column>
      <el-table-column fixed="right" show-overflow-tooltip prop="driverInfoName" label="司机" width="100">
      </el-table-column>
      <el-table-column fixed="right" prop="driverInfoPhone" label="司机手机" width="180">
      </el-table-column>
      <el-table-column fixed="right" prop="fare" label="车费(元)" width="100">
      </el-table-column>
    </el-table>

    <!--工具条-->
    <el-col :span="24" class="toolbar">
      <el-pagination
        :current-page="currentPage"
        :page-size="pageSize"
        @size-change="handleSizeChange"
        @current-change="handleCurrentPageChange"
        layout="total,sizes,prev, pager, next, jumper"
        :total="total" style="float: right">
      </el-pagination>
    </el-col>

    <el-dialog title="发车确认" @close="closeDepartDialog" :visible.sync="dialog2Visible">
      <el-form :key="departDialogKey" ref="loadingConfirmationForm" :model="loadingConfirmationForm"
               :rules="departRules" label-width="110px">
        <el-row class="dialog-el-row">
          <el-col :span="12">
            <el-form-item label="发车时间" :label-width="dialogFormLabelWidth" prop="actualDepartureDate">
              <el-date-picker
                format="yyyy-MM-dd HH:mm"
                v-model="loadingConfirmationForm.actualDepartureDate"
                type="datetime"
                placeholder="选择日期时间">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row class="dialog-el-row">
          <el-col :span="12">
            <el-form-item label="预计到达时间" :label-width="dialogFormLabelWidth" prop="expectedArrivalDate">
              <el-date-picker
                format="yyyy-MM-dd HH:mm"
                v-model="loadingConfirmationForm.expectedArrivalDate"
                type="datetime"
                placeholder="选择日期时间">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="车费" :label-width="dialogFormLabelWidth" prop="fare">
              <el-input v-model.number="loadingConfirmationForm.fare" type="number">
                <template slot="append">元</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row class="dialog-el-row">
          <el-col :span="12">
            <el-form-item :label-width="dialogFormLabelWidth" label="帐号支付" prop="accountPayment">
              <el-input v-model.number="loadingConfirmationForm.accountPayment" type="number">
                <template slot="append">元</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label-width="dialogFormLabelWidth" label="现金" prop="cash">
              <el-input v-model.number="loadingConfirmationForm.cash" type="number">
                <template slot="append">元</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item :label-width="dialogFormLabelWidth" label="储值卡">
          <el-row class="dialog-el-row">
            <el-col :span="5">
              <el-select v-model="dynamicValidateForm.domains[0].payType" placeholder="请选择">
                <el-option
                  v-for="item in $store.getters.PAY_CARD_TYPE"
                  :key="item.dictVal"
                  :label="item.cnDictValname"
                  :value="item.dictVal">
                </el-option>
              </el-select>
            </el-col>
            <el-col :span="8" style="margin: 0 5px 0 5px">
              <el-input v-model="dynamicValidateForm.domains[0].payNumber" placeholder="请输入储值卡号"></el-input>
            </el-col>
            <el-col :span="8" style="margin: 0 5px 0 5px">
              <el-input type="number" v-model.number="dynamicValidateForm.domains[0].payMoney" prop="ePayMoney"
                        placeholder="请输入储值卡金额"></el-input>
            </el-col>
            <el-col :span="2"><i @click="addDomain" class="el-icon-plus"></i></el-col>
          </el-row>
        </el-form-item>
        <el-form-item :label-width="dialogFormLabelWidth"
                      v-for="(domain, index) in dynamicValidateForm.domains"
                      :key="domain.key"
                      v-if="dynamicValidateForm.domains.length>1 && index>0">
          <el-row class="dialog-el-row" v-if="index !== 0">
            <el-col :span="5">
              <el-select v-model="dynamicValidateForm.domains[index].payType" placeholder="请选择">
                <el-option
                  v-for="item in $store.getters.PAY_CARD_TYPE"
                  :key="item.dictVal"
                  :label="item.cnDictValname"
                  :value="item.dictVal">
                </el-option>
              </el-select>
            </el-col>
            <el-col :span="8" style="margin: 0 5px 0 5px">
              <el-input v-model="dynamicValidateForm.domains[index].payNumber" placeholder="请输入储值卡号"></el-input>
            </el-col>
            <el-col :span="8" style="margin: 0 5px 0 5px">
              <el-input type="number" v-model.number="dynamicValidateForm.domains[index].payMoney" prop="ePayMoney"
                        placeholder="请输入储值卡金额"></el-input>
            </el-col>
            <el-col v-if="index == 0" :span="2"><i @click.prevent="addDomain" class="el-icon-plus"></i></el-col>
            <el-col v-else :span="2"><i @click.prevent="removeDomain(domain)" class="el-icon-minus"></i></el-col>
          </el-row>
        </el-form-item>
        <el-form-item :label-width="dialogFormLabelWidth" label="备注">
          <el-input type="textarea" v-model="loadingConfirmationForm.remark"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="depart" :loading="departLoading">确认发车</el-button>
                <el-button @click="closeDepartDialog">取消</el-button>
            </span>
    </el-dialog>
    <loading-list-detail ref="loadingListDetail" @addTrunkTask="addTrunkTask"></loading-list-detail>
    <no-stowage-trunk-task ref="noStowageTrunkTask" @addTrunkTaskOk="addTrunkTaskOk"></no-stowage-trunk-task>
    <!--start-->
    <div>
      <div style="visibility:hidden" id="div1">
        <DIV style="LINE-HEIGHT: 30px" class=size16                 align=center><STRONG><font
          color="#0000FF">福建联盟速运供应链管理有限公司</font></STRONG></DIV>
        <DIV style="LINE-HEIGHT: 30px" class=size16                 align=center><STRONG><font
          color="#0000FF">长途配载发车清单</font></STRONG>
        </DIV>
        <table border=1      cellSpacing=0     cellPadding=1       width="100%" height=40
               style="border-collapse: collapse"
               bordercolor="#333333">
          <tbody style="font-size: 15px">
          <tr>
            <td>装车序号：<SPAN id="number">    </SPAN></td>
            <td>车 牌 号：<SPAN id="plateNumber"></SPAN></td>
            <TD>挂车车牌：<SPAN> </SPAN></TD>
            <TD>发车时间：<SPAN id="departureDate"> </SPAN>></TD>
            <TD>预计到达：<SPAN id="expectedArrivalDate"> </SPAN></TD>
          </tr>
          <tr>
            <TD>始发站点：<SPAN id="dischargeOrganizationName"></SPAN></TD>
            <TD>司    机：<SPAN id="driverInfoName"></SPAN></TD>
            <TD>司机电话：<SPAN id="driverInfoPhone"></SPAN></TD>
            <TD>随车电话：<SPAN></SPAN></TD>
            <TD>发站负责人：<SPAN></SPAN></TD>
          </tr>
          <TR>
            <TD>到达站点：<SPAN id="currentOrgName"></SPAN></TD>
            <TD>司机驾驶证：<SPAN></SPAN></TD>
            <TD>到达联系人：<SPAN></SPAN></TD>
            <TD>联系电话：<SPAN></SPAN></TD>
            <TD>到站负责人：<SPAN></SPAN></TD>
          </TR>
          <TR>
            <TD>运输线路： <SPAN id="currentOrgName1"></SPAN></TD>
            <TD>到站地址：<SPAN></SPAN></TD>
            <TD colspan=3>公司地址：<SPAN></SPAN></TD>
          </TR>
          </tbody>
        </table>

        <table border=1       cellSpacing=0        cellPadding=1     width="100%" height=70
        style="border-collapse: collapse"
        bordercolor="#333333">
        <tbody style="font-size: 15px">
        <tr>
          <td colspan=10>&nbsp;发站负责人签名：<SPAN></SPAN></td>
          <td colspan=12>&nbsp;到站负责人签名：<SPAN></SPAN></td>
        </tr>
        </tbody>
        </table>

        <table border=1    cellSpacing=0    cellPadding=1   width="100%" height=70   style="border-collapse: collapse"
               bordercolor="#333333">
          <tbody>
          <TR>
            <TD colspan=8>&nbsp;司机直送提付款&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;元，移交给&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</TD>
            <TD rowspan=3                 colspan=1>&nbsp;未填项目请画线注销</TD>
            <TD colspan=12>&nbsp;实收司机直送提付款&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;元，改到达站收款&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;元</TD>
            <TD rowspan=3                 colspan=1>&nbsp;未填项目请画线注销</TD>
          </TR>
          <TR>
            <TD colspan=8>司机借款&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;元</TD>

            <TD colspan=12>&nbsp;改&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;公司签&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;元（授权指示人&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;）</TD>

          </TR>
          <TR>
            <TD colspan=8>&nbsp;托运结算员签字</TD>

            <TD colspan=12>&nbsp;到达结算员签字</TD>

          </TR>
          </tbody>
        </table>
      </div>

      <div style="visibility:hidden;" id="div2">
        <table border=1       id="tabletest" cellSpacing=0     cellPadding=1      width="100%" height="90%"
               style="border-collapse:collapse"
               bordercolor="#333333">
          <thead style="font-size: 11px">
          <TR>
            <TD width="3%">
              <DIV align=center><b>序号</b></DIV>
            </TD>
            <TD width="9.6%">
              <DIV align=center><b>订单号</b></DIV>
            </TD>
            <TD width="3.8%">
              <DIV align=center><b>下单日期</b></DIV>
            </TD>
            <TD width="5.4%">
              <DIV align=center><b>运单号</b></DIV>
            </TD>
            <TD width="3.8%">
              <DIV align=center><b>运输方式</b></DIV>
            </TD>
            <TD width="8.5%">
              <DIV align=center><b>目的地</b></DIV>
            </TD>
            <TD width="6.2%">
              <DIV align=center><b>收货人</b></DIV>
            </TD>
            <TD width="9.6%">
              <DIV align=center><b>收货电话</b></DIV>
            </TD>
            <TD width="3.8%">
              <DIV align=center><b>货物名称</b></DIV>
            </TD>
            <TD width="3.8%">
              <DIV align=center><b>包装</b></DIV>
            </TD>
            <TD width="3.5%">
              <DIV align=center><b>件数</b></DIV>
            </TD>
            <TD width="4.6%">
              <DIV align=center><b>重量T</b></DIV>
            </TD>
            <TD width="4.6%">
              <DIV align=center><b>体积M3</b></DIV>
            </TD>
            <TD width="5%">
              <DIV align=center><b>回单</b></DIV>
            </TD>
            <TD width="5%">
              <DIV align=center><b>到付</b></DIV>
            </TD>
            <TD width="5%">
              <DIV align=center><b>代收款</b></DIV>
            </TD>
            <TD width="3%">
              <DIV align=center><b>送货方式</b></DIV>
            </TD>
            <TD width="11.1%">
              <DIV align=center><b>备 注</b></DIV>
            </TD>
          </TR>
          </thead>
          <tbody id="mainDate" style="font-size: 12px">
          </tbody>
          <tfoot>
          <TR>
            <TD width="3.0%"><font>
              <DIV align=center>备注</DIV>
            </font></TD>
            <TD colspan=17><font SIZE="1">
              <DIV></DIV>
            </font></TD>
          </TR>
          <TR>
            <TD colspan=6><font>
              <DIV align=left>始发站经办人：</DIV>
            </font></TD>
            <TD colspan=6><font>
              <DIV align=left>到达站经办人：</DIV>
            </font></TD>
            <TD colspan=6><font>
              <DIV align=left>司机签字：</DIV>
            </font></TD>
          </TR>
          <TR>
            <TD colspan=18>注:车辆运费及付款方式请查看《货物运输合同》<font SIZE="1">
              <DIV></DIV>
            </font></TD>
          </TR>
          </tfoot>
        </table>
      </div>

    </div>
    <!--end-->
    <!--最后一行-->
  </div>

</template>

<script>
/* eslint-disable no-unused-vars,no-undef,quotes,no-unused-expressions */
import { getLodop } from '../../api/lodop/LodopFuncs.js';
import {
  pageLoadingListContentRoutes,
  deleteLoadingList,
  depart,
  searchLoadingListNoPage,
  getOrganizationById
} from '../../api/stowage/LoadingList';
import { getOrder } from '../../api/order/order.js';
import { exportLoadingList } from '../../api/export';
import { isEmpty, objToFilter } from '../../lib/util';
import LoadingListDetail from './LoadingListDetail.vue';
import NoStowageTrunkTask from './NoStowageTrunkTask.vue';
import { pringTrunkTasksPageANDLoadingList } from '../../api/stowage/TrunkTask';

export default {
  components: {
    LoadingListDetail,
    NoStowageTrunkTask
  },
  data () {
    return {
      currentIsSpecialLineOrg: false,
      orderCreateDate: '',
      token: this.$store.state.token,
      realName: this.$store.state.username,
      printLoadingList11: null,
      loadingList: {
        id: null,
        etcs: [],
        oilCard: [],
        cash: null,
        accountPayment: null,
        driverInfoPhone: null, // 司机手机
        driverInfoName: null, // 司机
        plateNumber: null, // 车牌
        transportationName: null, // 运输线路
        fare: null, // 车费
        number: null // 装车单号
      },
      // 储值卡动态添加
      dynamicValidateForm: {
        domains: [{
          payType: null, // 储值卡类型
          payNumber: '', // 储值卡号
          payMoney: null// 储值卡金额
        }]
      },
      // 发车确认弹框info
      loadingConfirmationForm: {
        currentOrgId: this.$store.state.currentOrganizationId,
        actualDepartureDate: null,
        loadingListId: null,
        expectedArrivalDate: null,
        fare: null,
        accountPayment: 0,
        cash: 0,
        remark: '',
        pays: []
      },
      departDialogKey: null,
      pringLoadingList: null,
      // 发车确认表单验证
      departRules: {
        actualDepartureDate: [
          {type: 'date', required: true, message: '请输入发车时间', trigger: 'blur'}
        ],
        expectedArrivalDate: [
          {type: 'date', required: true, message: '请选择预计到达时间', trigger: 'blur'}
        ],
        fare: [
          {required: true, message: '请输入车费'},
          {type: 'number', min: 0.01, message: '请输入数字！'}
        ],
        accountPayment: [
          {required: false, message: '请输入账户支付金额'},
          {type: 'number', min: 0, message: '请输入数字！'}
        ],
        cash: [
          {required: false, message: '请输入现金支付金额'},
          {type: 'number', min: 0, message: '请输入数字！'}
        ],
        ePayMoney: [
          {required: false, message: '请输入现金支付金额'},
          {type: 'number', min: 0, message: '请输入数字！'}
        ]
      },
      dialogFormLabelWidth: '150px',
      departLoading: false,
      selectedLoadingList: null,
      loadingConfirmation: false, // 暂时不装车确认操作 原值true
      departureConfirmation: true,
      tableData: [],
      sels: [],
      searchCondition: {},
      total: 0,
      currentPage: 1,
      pageSize: 10,
      listLoading: false,
      dialog2Visible: false
    };
  },
  methods: {
    // 打印装车单
    printLoadingList () {
      exportLoadingList(this.selectedLoadingList.id);
    },

    // 导出装车单
    LoadingLIstExpress () {
      searchLoadingListNoPage({
        filters: ''
      }).then(res => {
        if (res.data.successFlg) {
          let timestamp3 = new Date().getTime();
          this.$ue.downloadFile(res.data.detailModelList.map(item => [item.createDate, item.number, item.transportationName, item.driverInfoName, item.driverInfoPhone, item.statusName, item.fare, item.plateNumber, item.totalAmount, item.totalVolume, item.totalWeight, item.poll]), ['创单时间 ', '装车单号', '运输线路', '司机', '手机号', '状态', '车费', '车牌', '总件数', '总体积', '总重量', '票数'], '装车单导出文件' + timestamp3);
        } else {
          return this.$message.error('目前暂无数据，无法导出');
        }
      });
    },
    addTrunkTaskOk () {
      this.$refs.loadingListDetail.trunkTaskQuery();
    },
    addTrunkTask (id) {
      this.$refs.noStowageTrunkTask.show(id);
    },
    adjust () {
      this.$refs.loadingListDetail.show(this.selectedLoadingList, true);
    },
    showLoadingList (row) {
      this.$refs.loadingListDetail.show(row);
    },
    handleCurrentChange (val) {
      if (val) {
        this.selectedLoadingList = val;
        this.loadingConfirmationForm.loadingListId = val.id;
        this.departureConfirmation = (val.status !== 105007001); // 暂时创建后下一操作为发车
      } else {
        this.selectedLoadingList = null;
        this.loadingConfirmationForm.loadingListId = null;
        this.departureConfirmation = false;
      }
    },
    handleSizeChange (val) {
      this.pageSize = val;
      this.queryLoadingList();
    },
    handleCurrentPageChange (val) {
      this.currentPage = val;
      this.queryLoadingList();
    },
    // test print --lhq start
    printLoadList () {
      this.loadGetLodop();
      if (this.sels.length !== 1) {
        return this.$message.error('一次只能打印一次，请只选择一条数据');
      }
      ;
      let loadListData = this.sels;
      let legNum = loadListData[0].routes.length;
      if (legNum > 0) {
        legNum = legNum - 1;
      }
      document.getElementById('number').innerHTML = loadListData[0].number;
      document.getElementById('departureDate').innerHTML = loadListData[0].departureDate;
      document.getElementById('expectedArrivalDate').innerHTML = loadListData[0].expectedArrivalDate;
      document.getElementById('dischargeOrganizationName').innerHTML = loadListData[0].routes[0].dischargeOrganizationName;
      document.getElementById('currentOrgName').innerHTML = loadListData[0].routes[legNum].dischargeOrganizationName;
      document.getElementById('currentOrgName1').innerHTML = loadListData[0].transportationName;
      document.getElementById('plateNumber').innerHTML = loadListData[0].plateNumber;
      document.getElementById('driverInfoName').innerHTML = loadListData[0].driverInfoName;
      document.getElementById('driverInfoPhone').innerHTML = loadListData[0].driverInfoPhone;
      let ids = this.sels.map(item => item.id);
      let id = ids[0];
      let x = 1;
      pringTrunkTasksPageANDLoadingList({
        filters: 'EQ_loadingListTrunkTask.loadingListRoute.loadingList.id=' + id
      }).then(res => {
        let totalTicket = 0;
        let totalAmount = 0;
        let totalWeight = 0;
        let totalVolume = 0;
        let totalReceiptAmount = 0; // 回单
        let totalCollectPaymentAmount = 0; // 代收款
        let totalToPayAmount = 0; // 到付
        document.getElementById('mainDate').innerHTML = '';
        if (res.data.successFlg) {
          let list = res.data.detailModelList;
          list.forEach(item => {
            getOrder(this.token, item.order.id).then((res) => {
              if (res.data.successFlg) {
                this.orderCreateDate = res.data.obj.createDate;
              }
            });
            let row = document.createElement('tr'); // 创建行
            let td1 = document.createElement('td'); // 创建单元格
            td1.appendChild(document.createTextNode(x)); // 序号
            x += 1;
            let td2 = document.createElement('td'); // 创建单元格
            td2.appendChild(document.createTextNode(item.order.orderNumber)); // 订单编号
            let td3 = document.createElement('td'); // 创建单元格
            if (!isEmpty(item.order.createDate)) {
              let ctn = new Date(item.order.createDate);
              td3.appendChild(document.createTextNode((ctn.getMonth() + 1) + '/' + ctn.getDate())); // 下单日期
            } else {
              td3.appendChild(document.createTextNode('')); // 运单日期
            }
            let td4 = document.createElement('td'); // 创建单元格
            if (!isEmpty(item.order.transportationNumber)) {
              td4.appendChild(document.createTextNode(item.order.transportationNumber)); // 运单号
            } else {
              td4.appendChild(document.createTextNode('')); // 运单号
            }
            let td5 = document.createElement('td'); // 创建单元格
            td5.appendChild(document.createTextNode(item.order.agingName)); // 运输方式
            let td6 = document.createElement('td'); // 创建单元格
            td6.appendChild(document.createTextNode(item.order.cityAndCounty)); // 目的地
            let td7 = document.createElement('td'); // 创建单元格
            td7.appendChild(document.createTextNode(item.order.sendContactName));// 收货人
            let td8 = document.createElement('td'); // 创建单元格
            let tel = '';
            if (!isEmpty(item.order.sendContactPhone) && !isEmpty(item.order.sendTelephone)) {
              tel = item.order.sendContactPhone + ' \n ' + item.order.sendTelephone;
            } else if (!isEmpty(item.order.sendContactPhone)) {
              tel = item.order.sendContactPhone;
            } else if (!isEmpty(item.order.sendTelephone)) {
              tel = item.order.sendTelephone;
            }
            td8.appendChild(document.createTextNode(tel)); // 收货电话
            let td9 = document.createElement('td'); // 创建单元格
            td9.appendChild(document.createTextNode(item.order.cargoNames)); // 货物名称
            let td10 = document.createElement('td'); // 创建单元格
            td10.appendChild(document.createTextNode(item.order.packTypeNames)); // 包装
            let td11 = document.createElement('td'); // 创建单元格
            td11.appendChild(document.createTextNode(item.amount)); // 件数
            let td12 = document.createElement('td'); // 创建单元格
            let wt = item.weight;
            if (!isEmpty(item.weight)) {
              wt = item.weight.toFixed(2);
            }
            td12.appendChild(document.createTextNode(wt)); // 重量
            let td13 = document.createElement('td'); // 创建单元格
            td13.appendChild(document.createTextNode(item.volume)); // 体积
            let td14 = document.createElement('td'); // 创建单元格
            let receipt = '';
            if (!isEmpty(item.receiptTypeName) && !isEmpty(item.receiptAmount)) {
              receipt = item.receiptTypeName + item.order.receiptAmount + '';
            } else if (!isEmpty(item.receiptTypeName)) {
              receipt = item.receiptTypeName;
            }
            td14.appendChild(document.createTextNode(receipt)); // 回单份数
            let td15 = document.createElement('td'); // 创建单元格
            td15.appendChild(document.createTextNode(item.order.toPayAmount)); // 到付
            let td16 = document.createElement('td'); // 创建单元格
            td16.appendChild(document.createTextNode(item.order.collectPaymentAmount)); // 代收款
            let td17 = document.createElement('td'); // 创建单元格
            td17.appendChild(document.createTextNode(item.order.sendTypeName)); // 送货方式
            let td18 = document.createElement('td'); // 创建单元格
            if (!isEmpty(item.order.remark)) {
              td18.appendChild(document.createTextNode(item.order.remark)); // 备注
            } else {
              td18.appendChild(document.createTextNode('')); // 备注
            }
            row.appendChild(td1); // 将单元格添加到行内
            row.appendChild(td2); // 将单元格添加到行内
            row.appendChild(td3); // 将单元格添加到行内
            row.appendChild(td4); // 将单元格添加到行内
            row.appendChild(td5); // 将单元格添加到行内
            row.appendChild(td6); // 将单元格添加到行内
            row.appendChild(td7); // 将单元格添加到行内
            row.appendChild(td8); // 将单元格添加到行内
            row.appendChild(td9); // 将单元格添加到行内
            row.appendChild(td10); // 将单元格添加到行内
            row.appendChild(td11); // 将单元格添加到行内
            row.appendChild(td12); // 将单元格添加到行内
            row.appendChild(td13); // 将单元格添加到行内
            row.appendChild(td14); // 将单元格添加到行内
            row.appendChild(td15); // 将单元格添加到行内
            row.appendChild(td16); // 将单元格添加到行内
            row.appendChild(td17); // 将单元格添加到行内
            row.appendChild(td18); // 将单元格添加到行内
            document.getElementById('mainDate').append(row); // 将行添加到<tbody>中
            if (item.order) {
              totalAmount += item.amount;
              totalWeight += item.weight;
              totalVolume += item.volume;
              if (item.order.receiptAmount !== undefined) {
                totalReceiptAmount += item.order.receiptAmount;
              }
              if (item.order.collectPaymentAmount !== undefined) {
                totalCollectPaymentAmount += item.order.collectPaymentAmount;
              }
              if (item.order.toPayAmount !== undefined) {
                totalToPayAmount += item.order.toPayAmount;
              }
            }
          });
        }
        if (totalToPayAmount === undefined || totalToPayAmount === null || totalToPayAmount === '') {
          totalToPayAmount = 0;
        }
        if (totalCollectPaymentAmount === undefined || totalCollectPaymentAmount === null | totalCollectPaymentAmount === '') {
          totalCollectPaymentAmount = 0;
        }
        // lodop
        LODOP.PRINT_INIT('配载发车清单打印演示');
        LODOP.SET_PRINT_PAGESIZE(2, '240mm', '280mm', 'CreateCustomPage');
        //   var strStyle = "<style> table,td,th {border-width: 1px;border-style: solid;border-collapse: collapse}</style>"
        LODOP.ADD_PRINT_HTM(143, '4%', '90%', 360, document.getElementById('div1').innerHTML);
        LODOP.SET_PRINT_STYLEA(0, 'ItemType', 0);
        LODOP.ADD_PRINT_HTM(500, '4%', '90%', 280, document.getElementById('div2').innerHTML);
        LODOP.SET_PRINT_STYLEA(0, 'LinkedItem', -2);
        LODOP.SET_PRINT_STYLEA(0, 'ItemType', 0);
        LODOP.SET_PRINT_STYLEA(0, 'Offset2Top', -260);
        LODOP.ADD_PRINT_HTM(123, 760, 300, 100, '总页号：<font format=\'ChineseNum\'><span tdata=\'pageNO\'>第##页</span>/<span tdata=\'pageCount\'>共##页</span></font>');
        LODOP.SET_PRINT_STYLEA(0, 'ItemType', 1);
        LODOP.PREVIEW();
      });
    },
    // 载入打印信息
    loadGetLodop () {
      getLodop();
    },
    // test print --lhq end
    selsChange (sels) {
      this.sels = sels;
    },
    formatterTrunkTasks (row) {
      return row.totalAmount + '件/' + row.totalWeight.toFixed(2) + '吨/' + row.totalVolume.toFixed(2) + '方';
    },
    getDepartById () {
      this.departDialogKey = Math.random() - 0.5;
      this.loadingConfirmationForm.actualDepartureDate = new Date();
      this.dialog2Visible = true;
    },
    // 获取当前操作机构信息-是否为专线机构
    getCurrentOrgInfo () {
      getOrganizationById(this.$store.state.currentOrganizationId).then(res => {
        if (res.data.successFlg) {
          let orgAttribute = res.data.obj.attribute;
          if (orgAttribute && orgAttribute === 110007003) {
            this.currentIsSpecialLineOrg = true;
          }
          ;
        }
        ;
      }).catch(err => {
        console.error(err);
      });
    },
    //* ***充值卡动态增删开始************
    removeDomain (item) {
      var index = this.dynamicValidateForm.domains.indexOf(item);
      if (index !== -1) {
        this.dynamicValidateForm.domains.splice(index, 1);
      }
    },
    addDomain () {
      this.dynamicValidateForm.domains.push({
        payType: null,
        payNumber: '',
        payMoney: null
      });
    },
    //* ***充值卡动态增删-结束*************

    // 发车确认操作***
    depart () {
      this.loadingConfirmationForm.pays = this.dynamicValidateForm.domains;
      this.$refs['loadingConfirmationForm'].validate((valid) => {
        if (valid) {
          this.departLoading = true;
          let o = Object.assign({}, this.loadingConfirmationForm);
          o.actualDepartureDate = o.actualDepartureDate.toJSON();
          o.expectedArrivalDate = o.expectedArrivalDate.toJSON();
          depart(o).then(res => {
            this.departLoading = false;
            if (res.data.successFlg) {
              this.$message.success('发车成功');
              this.resetDepartDialog();
              this.dialog2Visible = false;
              this.queryLoadingList();
            } else {
              this.$message.error(res.data.errorMsg);
            }
          });
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    // 弹窗清空数据
    resetDepartDialog () {
      this.loadingConfirmationForm.expectedArrivalDate = null;
      this.loadingConfirmationForm.fare = null;
      this.loadingConfirmationForm.accountPayment = 0;
      this.loadingConfirmationForm.cash = 0;
      this.loadingConfirmationForm.remark = '';
      this.loadingConfirmationForm.ePays = [];
      this.dynamicValidateForm.domains = [{
        payType: null,
        payValue: '',
        payMoney: null
      }];
    },
    // 发车弹窗取消操作
    closeDepartDialog () {
      this.dialog2Visible = false;
      this.resetDepartDialog();
    },
    remove () {
      this.$confirm('您确认删除这些装车单?', '提示', {
        type: 'warning'
      }).then(() => {
        let ids = this.sels.map(item => item.id);
        deleteLoadingList(ids).then(res => {
          if (res.data.successFlg) {
            this.$message({
              message: '删除成功',
              type: 'success'
            });
            this.queryLoadingList();
          } else {
            this.$message.error(res.data.errorMsg);
          }
        });
      });
    },
    selectable (row, index) {
      return row.status === 105007001;
    },
    queryLoadingList () {
      this.loadingLists(objToFilter(this.searchCondition));
    },
    resetSearchCondition () {
      this.$refs.ueSearchBar.reset();
    },
    loadingLists (filter) {
      this.listLoading = true;
      this.loadingConfirmation = true;
      pageLoadingListContentRoutes({
        filters: filter,
        size: this.pageSize,
        page: this.currentPage
      }).then(res => {
        if (res.data.successFlg) {
          this.tableData = res.data.detailModelList;
          this.currentPage = res.data.currPage;
          this.total = res.data.totalCount;
          this.pageSize = res.data.pageSize;
          this.listLoading = false;
        }
      });
    }
  },
  computed: {
    btns () {
      return this.$store.state.btns[this.$route.path] || [];
    },
    querys () {
      return this.$store.state.querys[this.$route.path + '#default'] || [];
    }
  },
  mounted () {
    this.getCurrentOrgInfo();
    this.$store.commit('initDict');
    this.loadingLists('');
  }
};
</script>
